<template>
	<div class="item" @click="goChat">
		<div style="width: 100rpx;height: 100rpx;display: flex;justify-content: center;align-items: center;">
			<view style="position: relative;">
				<u-badge type="error" :offset="[-10,-10]" :count="unread"></u-badge>
				<view style="width: 100rpx;height: 100rpx;display: flex;justify-content: center;align-items: center;" v-if="users.length == 0">
					<u-avatar mode="square" :src="avatar ? avatar : gavatar"></u-avatar>
				</view>
				<gavatariew :users="users" v-else />
			</view>
		</div>
		<div style="height: 80rpx;display: flex;flex-direction: column;flex: 1;justify-content: center;padding: 10rpx 10rpx 20rpx 10rpx;border-bottom: 1rpx solid #f3f3f3;">
			<div style="display: flex;width: 100%;justify-content: space-between;">
				<div style="font-weight: bold;font-size: 32rpx;">{{name}}</div>
				<div style="color: dimgray;font-size: 25rpx;">{{$u.timeFormat(last_time, 'mm-dd hh:MM')}}</div>
			</div>
			<div style="color: dimgray;font-size: 25rpx;margin-top: 10rpx;min-height: 32rpx;width: 70%;" class="u-line-1">
				<image v-if="subTitle && subTitle.indexOf('__emoji__') == 0" :src="`/static/images/emoji/EMOJI-${subTitle.replace('__emoji__','')}.png`" style="width: 30rpx;height: 30rpx;" mode=""></image>
				<text v-else>{{subTitle}}</text>
				
			</div>
		</div>
	</div>
</template>

<script>
	import gavatariew from './gavatarview.vue'
	export default {
		name:"chatListItem",
		data(){
			return {
				gavatar:''
			}
		},
		components:{gavatariew},
		props:{
			name:{
				type:String,
				default:"Name"
			},
			subTitle:{
				type:String,
				default:"SubTitle"
			},
			avatar:{
				type:String,
				default:"/static/images/avatar.png"
			},
			last_time:{
				type:Number,
				default:0
			},
			unread:{
				type:Number,
				default:0
			},
			fid:{
				type:Number,
				default:0
			},
			gid:{
				type:Number,
				default:0
			},
			uid:{
				type:Number,
				default:0
			},
			users:{
				type:Array,
				default:function(){
					return []
				}
			}
		},
		mounted() {
			console.log(1158,this.users)
			this.gavatar = '';
		},
		methods:{
			goChat:function(){
				const _this = this
				console.log(this.gid)
				if(this.gid == 0 || !this.gid){
					this.$store.dispatch({
						type:"fchat/getFChatMessageInit",
						payload:{
							id:_this.fid,
							callback:()=>{
								uni.navigateTo({
									url:"/pages/chat/friend/index?id=" + _this.fid
								})
							}
						}
					})
				}else{
					this.$store.dispatch({
						type:"gchat/getGChatMessageInit",
						payload:{
							id:_this.gid,
							callback:()=>{
								uni.navigateTo({
									url:"/pages/chat/group/index?id=" + _this.gid
								})
							}
						}
					})
				}
			}
		}
	}
</script>

<style>
	.item{
		display: flex;
		align-items: center;
		width: 100%;
		height: 100rpx;
		padding: 10rpx 0rpx;
	}
</style>